<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>商品列表</title>
    <script src="/js/jquery-3.3.1.min.js"></script>



</head>
<body>
<!--startprint-->
<style type="text/css">
    .record-box {
        position: relative;
        width: 900px;
        padding: 0 5px;
        font-size: 13px;
        color: #787878;
    }

    .record-head {
        margin: -20px 0 80px 0;
        height: 40px;
        line-height: 40px;
        font-size: 13px;
    }

    .record-head span {
        float: left;
    }

    .record-head i {
        float: right;
        font: normal 28px/30px Tahoma;
        cursor: pointer;
    }

    .record-code {
        position: absolute;
        left: 50%;
        top: 10px;
        margin-left: -110px;
        width: 220px;
        font-size: 14px;
        text-align: center;
    }

    .record-code img {
        width: 100%;
        display: block;
    }

    .record-code span {
        line-height: 2;
    }

    .record-box h2 {
        font-weight: normal;
        font-size: 20px;
        margin-bottom: 20px;
    }

    .record-info {
        line-height: 34px;
        overflow: hidden;
        margin-bottom: 15px;
    }

    .record-info span {
        float: left;
        width: 33.3%;
        text-align: left;
    }

    .record-info span:nth-child(3n-1) {
        padding-left: 9%;
        width: 35.66%;
    }

    .record-info span:nth-child(3n) {
        width: 20%;
    }

    .record-info span:last-child {
        width: 100%;
    }

    .record-table {
        overflow-y: auto;
    }

    .record-table table {
        width: 100%;
    }

    .record-table th, .record-table td {
        padding: 10px 0;
        font-size: 13px;
        text-align: center;
        border: 1px solid #787878;
    }

    .record-table th {
        padding: 5px 0;
    }

    .record-button {
        position: absolute;
        width: 100%;
        left: 0;
        bottom: 10px;
        text-align: center;
    }

    .record-button a {
        border: 1px solid #787878;
        padding: 10px 15px;
        font-size: 14px;
        color: #787878;
    }
</style>
<div class="record-box">
<!--    <h2>订单商品</h2>-->
    <div class="record-table">
        <table>
            <thead>
            <tr>
                <th>序号</th>
                <th></th>
                <th>SKU</th>
<!--                <th>商品</th>-->
                <th>规格</th>
                <th>数量</th>
                <th>来源</th>
                <th>来源单号</th>
                <th>所在仓位</th>
                <th>状态</th>
            </tr>
            </thead>
            <tbody id="r-table">
            <tr th:each="item:${goodsList}">
                <td th:text="${itemStat.index + 1}"></td>
                <td><img th:src="${item.colorImage}" height="65px"/> </td>
                <td th:text="${item.skuNumber}">1</td>
<!--                <td th:text="${item.goodsName}">HY19M001Q012L0001</td>-->

                <td >
                    颜色：<span th:text="${item.colorValue}"></span>&nbsp;
                    尺码：<span th:text="${item.sizeValue}"></span>&nbsp;
                </td>

                <td th:text="${item.quantity}">1</td>
                <td th:text="${item.sourceChannel}">1</td>
                <td th:text="${item.sourceOrderNo}">1</td>
                <td>
                    <ul>
                        <li th:each="it:${item.stocks}">仓位：<span th:text="${it.locationName}"></span>&nbsp;&nbsp;剩余库存：<span th:text="${it.currentQty}"></span>&nbsp;&nbsp;锁定库存：<span th:text="${it.lockedQty}"></span></li>
                    </ul>
                </td>
                <td>
                    <span style="color: red" th:text="${T(com.b2c.erp.enums.EnumErpOrderSendStatus).getName(item.status)}"></span>
                </td>
            </tr>

            </tbody>
        </table>
    </div>

</div>
<!--endprint-->
<div>
</div>
</body>
</html>